<template>
  <div>
    <table>
      <thead>
        <th>ID</th>
        <th>书名</th>
        <th>作者</th>
        <th>出版社</th>
        <th>操作</th>
      </thead>
      <tr v-for="item in list" :key="item.id">
        <td>{{ item.id }}</td>
        <td>{{ item.bookname }}</td>
        <td>{{ item.author }}</td>
        <td>{{ item.publisher }}</td>
        <td><slot name="btn" :item="item"></slot></td>
      </tr>
    </table>
  </div>
</template>
<script>
export default {
  data() {
    return {};
  },
  props: {
    list: {
      type: Array,
    },
  },
  created() {},
  computed: {},
  methods: {},
};
</script>
<style lang='less'  scoped>
table {
  border-collapse: collapse;
  border: 1px solid #ddd;
  th,
  td {
    border: 1px solid #ddd; /* 单元格内边框 */
    padding: 10px; /* 单元格内边距 */
    text-align: center; /* 文本居中 */
  }
}
</style>
